import { defineComponent, h, watch, ref, onMounted, onUnmounted } from '@vue/runtime-core'
import enemyImg from '../../assets/enemy.png'

export const enemyPlaneInfo = {
    width: 308,
    height: 207,
    life: 3
}
export default defineComponent({
    props: ['x', 'y', 'speed'],
    setup (props, ctx) {
        const x = ref(props.x)
        const y = ref(props.y)

        watch(props, (newValue) => {
            x.value = newValue.x
            y.value = newValue.y
        })
        useAttack(ctx, x, y)
        return {
            x,
            y
        }
    },
    render(ctx){
        return h('Sprite', {
                x: ctx.x,
                y: ctx.y,
                texture: enemyImg
            })
    }
})

const useAttack = (ctx, x, y) => {
    //发射子弹
    const attackInterval = 2000
    let interval
    onMounted(() => {
        interval = setInterval(() => {
            ctx.emit('attack', {
                x: x.value + 124,
                y: y.value + 207
            })
        }, attackInterval)
    })

    onUnmounted(() => {
        clearInterval(interval)
    })
}